avalon.ready(function() {

    require(['world'], function(world) {

        function randomColor() {
            return '#' + (function co(lor) {
                return (lor +=
                    [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f'][Math.floor(Math.random() * 16)]) && (lor.length == 6) ? lor : co(lor);
            })('');
        }
        world.new({
            container: $("#world")[0]
        });
        var topfaceGeometry, topbodyGeometry, bottomfaceGeometry, holetrajectoryGeometry;
        var manager = new THREE.LoadingManager();

        var jsonloader = new THREE.JSONLoader(manager);
        jsonloader.load('http://192.168.11.123:5000/monitor/static/js/topface.json', function(geometry, material) {
            topfaceGeometry = geometry;
        });
        jsonloader.load('http://192.168.11.123:5000/monitor/static/js/topbody.json', function(geometry, material) {
            topbodyGeometry = geometry;
        });
        jsonloader.load('http://192.168.11.123:5000/monitor/static/js/bottomface.json', function(geometry, material) {
            bottomfaceGeometry = geometry;
        });
        jsonloader.load('http://192.168.11.123:5000/monitor/static/js/holetrajectory.js', function(geometry, material) {
            holetrajectoryGeometry = geometry;
        });
        manager.onLoad = function() {

            var floor = new THREE.Object3D();

            topface = new THREE.Mesh(topfaceGeometry, new THREE.MeshBasicMaterial({
                color: 0x9bb345,
                // map:shadowTexture,
                shading: THREE.FlatShading,
                side: THREE.DoubleSide,
                wireframe: false,
                transparent: true,
                opacity: 0.5,
            }));


            var topbody = new THREE.Mesh(topbodyGeometry, new THREE.MeshBasicMaterial({
                color: 0x9bb345,
                shading: THREE.FlatShading,
                side: THREE.DoubleSide,
                wireframe: false,
                transparent: true,
                opacity: 0.5,
            }));

            var bottomface = new THREE.Mesh(bottomfaceGeometry, new THREE.MeshBasicMaterial({
                color: 0x9bb345,
                shading: THREE.FlatShading,
                side: THREE.DoubleSide,
                wireframe: false,
                transparent: true,
                opacity: 0.5,
            }));

            var holetrajectory = new THREE.Mesh(holetrajectoryGeometry, new THREE.MeshBasicMaterial({
                color: 0xff0000,
                shading: THREE.FlatShading,
                side: THREE.DoubleSide,
                wireframe: false,
                transparent: false,
            }));

            floor.add(topface);
            floor.add(topbody);
            floor.add(bottomface);
            floor.add(holetrajectory);
            floor.scale.set(1000, 1000, 1500);
            floor.rotation.y += Math.PI / 4;

            world.add(floor);


        };

        var canvas = $("#canvasTest")[0];
        var context = canvas.getContext('2d');
        context.rect(0, 0, canvas.width, canvas.height);
        


        function buildTexture() {
            context.clearRect(0, 0, canvas.width, canvas.height);
            var gradient = context.createLinearGradient(0, canvas.height, 0, 0);
            var rco = randomColor();
            gradient.addColorStop(0, rco);
            rco = randomColor();
            gradient.addColorStop(0.25, rco);
            rco = randomColor();
            gradient.addColorStop(0.5, rco);
            rco = randomColor();
            gradient.addColorStop(0.75, rco);
            rco = randomColor();
            gradient.addColorStop(1, rco);
            context.fillStyle = gradient;
            context.fill();

            if (topfaceGeometry) {
                var shadowTexture = new THREE.Texture(canvas);
                shadowTexture.needsUpdate = true;
                topface.material.map = shadowTexture;
                topface.material.map.minFilter = THREE.LinearFilter;
                topface.material.needsUpdate = true;
            }

            setTimeout(buildTexture, 1 * 1000);
        };

        buildTexture();

    });
});